<!-- 写动态弹框 -->
<template>
  <a-modal
    width="50%"
    :visible="visible"
    @ok="handleOk"
    @cancel="handleCancel"
    :mask-closable="false"
    draggable
    title-align="center"
    title="写动态"
  >
    <div>
      <a-form :model="form.data" @submit="handleSubmit">
        <a-form-item field="name" label="title" hide-label>
          <a-input v-model="form.data.title" placeholder="请输入标题" />
        </a-form-item>
        <a-form-item field="post" label="content" hide-label>
          <RichTextNew
            v-model:content="form.data.content"
            ref="richText"
          ></RichTextNew>
        </a-form-item>
      </a-form>
    </div>
    <template #footer>
      <a-select :style="{ width: '250px' }" placeholder="请选择">
        <a-option :value="1">任何人都可以评论</a-option>
        <a-option :value="2">仅显示我筛选后的评论</a-option>
        <a-option :value="3">关注我3天及以上的人能评论</a-option>
        <a-option :value="4">我关注的人能评论</a-option>
        <a-option :value="5">不允许评论</a-option>
      </a-select>
      <a-button type="primary">发布</a-button>
    </template>
  </a-modal>
</template>

<script lang="ts" setup>
import { reactive } from 'vue';

const props = withDefaults(
  defineProps<{
    visible: boolean; // 是否显示对话框
  }>(),
  {
    visible: false
  }
);

const emit = defineEmits(['update:visible', 'intershipStateChange']);

const form = reactive({
  data: {
    title: '',
    content: ''
  }
});
// 保存
const handleOk = () => {
  emit('update:visible', false);
  // emit('intershipStateChange', props.type);
};

// 取消
const handleCancel = () => {
  emit('update:visible', false);
};
</script>

<style scoped lang="less">
.content {
  .dept {
    :deep(.arco-form-item-content-wrapper) {
      width: 200%;
    }
  }
}
</style>
